<template>
	<basic-container>
		<el-form class="form-container" :model="postObj" ref="postObj">
			<el-form-item label="角色名称" label-width="100px">
				<el-input v-model="postObj.name">
				</el-input>
			</el-form-item>
			<el-form-item label="权限" label-width="100px">
				<el-radio v-model="postObj.datas" label=1>本人</el-radio>
				<el-radio v-model="postObj.datas" label=2>本部门</el-radio>
				<el-radio v-model="postObj.datas" label=3>下属部门</el-radio>
				<el-radio v-model="postObj.datas" label=9>全部</el-radio>
			</el-form-item>
			<el-form-item label-width="100px" label="相关人员">
				<el-select v-model="postObj.users" filterable style="width: 100%;" multiple placeholder="请选择">
					<el-option v-for="item in alluser" :key="item.key" :label="item.label" :value="item.key">
					</el-option>
				</el-select>
			</el-form-item>
			<el-form-item label="备注" label-width="100px">
				<el-input v-model="postObj.remark"></el-input>
			</el-form-item>
			<div class="el-form-item" style="text-align:right;">
				<el-button v-loading="loading" type="primary" size="mini" @click="submitForm">保存</el-button>
			</div>
		</el-form>
	</basic-container>
</template>

<script>
	import * as role from '@/api/system/role';
	import {
		alluser
	} from "@/api/system/user";

	const defaultScheme = {
		datas: '1',
		name: '',
		summary: '',
		users: []
	}
	export default {
		name: 'role-edit',
		props: {
			editId: {
				default: ''
			},
			isEdit: {
				type: Boolean,
				default: false
			}
		},
		data() {
			return {
				alluser: [],
				loading: false,
				postObj: Object.assign({}, defaultScheme)
			}
		},
		created() {
			alluser().then(res => {
				const data = [];
				res.data.data.forEach(ele => {
					data.push({
						label: ele.trueName,
						key: ele.id
					});
				})
				this.alluser = data;
			});
			if (this.isEdit) {
				role.getModel(this.editId).then(res => {
					this.postObj = res.data.data
				}).catch(err => {
					console.log(err)
				})
			}
		},
		methods: {
			submitForm() {
				this.loading = true
				if (this.postObj.name == undefined || this.postObj.name === '') {
					this.$message({
						message: '名称为必填项！',
						type: 'error'
					})
					this.loading = false
					return
				}
				if (this.isEdit) {
					console.log(this.postObj)
					role.update(this.postObj).then(() => {
						this.loading = false
						this.$emit('closeMoule')
					})
				} else {
					role.add(this.postObj).then(() => {
						this.loading = false
						this.$emit('closeMoule')
					})
				}
				this.loading = false
			}
		}
	}
</script>

<style lang="scss">
</style>
